<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="keywords" content="编程云">
    <meta name="description" content="编程云">
    <meta name="robots" content="all">
    <meta name="copyright" content="">
    <meta name="author" content="编程云">
    <title>实验云</title>
    <!--<link rel=stylesheet href="css/codemirror.min.css">-->
    <link rel="stylesheet" href="CodeMirror/css/style.css" type="text/css">
    <!--<link href="CodeMirror/addon/hint/show-hint.css" rel="stylesheet">-->
    <link href="CodeMirror/css/bootstrap.min.css" rel="stylesheet">
    <link rel=stylesheet href="css/head.css">
    <link rel="stylesheet" type="text/css" href="CodeMirror/css/mycourse.css">
    <!--<link rel=stylesheet href="CodeMirror/theme/eclipse.css">-->
    <link href="css/video-js.css" rel="stylesheet" type="text/css">
    <link href="css/code.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <script src="CodeMirror/js/jquery.min.js"></script>
    <script src="CodeMirror/js/bootstrap.min.js"></script>
    <script src="js/artTemplate.js"></script>
    <script src="js/template-native.js"></script>
    <script type="text/javascript" src="layer/layer.js"></script>
    <script src="CodeMirror/js/Drag.js"></script>
    <script type="text/javascript" src="js/HOST.js"></script>
    <script src="js/main.js"></script>
    <script register-percent="100" src="js/video.js"></script>
    <style type="text/css">
        html,body{
            height: 100%;
            width: 100%;
        }
    </style>
</head>
<body style="padding: 0;">
    <div id="vid" style="width: 100%;height: 100%;float:left;overflow: hidden">
        <video id="my-video" class="col-center-block video-js" ></video>
    </div>
    <script type="text/javascript">
        var lan_height ="";
        function setHeight(){
            vod(document.body.clientWidth,lan_height);
        }
        $(function () {
            chapterId=window.location.href.split('=')[1];
            getChapter(chapterId);
        });
        function getChapter(chapterId) {
            var data={
                buschapter:{
                    id:chapterId
                }
            };
            request('business.busChapter.get',data,function callback(result) {
                console.log("chapterinfo:"+JSON.stringify(result));
                if(result.code == 0){
                    courseId =result.value.courseId;
                    videoUrl = result.value.resourceUrl;
//                    types = result.value.type;
//                    console.log(result.msg);
                }else{
                    console.log(result.msg);
                }
            },false)

        }
        function vod(width, height) {
            var myPlayer =
                    videojs("my-video", {
                        "controls": true,
                        "autoplay": true,
                        "preload": "auto",
                        "poster": "oceans.png",
                        "width": width,
                        "height": height,
                        playbackRates:[1, 1.5, 2],
                        sources: [
                            {src: videoUrl, type: 'video/mp4'}
                        ]
                    });
            // myPlayer.videoJsResolutionSwitcher();
            // myPlayer.on("ended", function () {
            //     console.log("end", this.currentTime());
            //     var bcR = {
            //         buschapterrecord: {
            //             userId: getCookie('loginResult') === "" ? "" : JSON.parse(getCookie('loginResult')).id,
            //             chapterId: chapterId,
            //             courseId: courseId
            //         }
            //     };
            //     request('business.busChapterRecord.finishBusCha', bcR, function callback(result) {
            //
            //     });
            // });
        }
        //播放/暂停，采用同一个方法实现
//        function playPause(){
//            //获取视频DOM元素
//            var myVideo = document.getElementById("my-video");
//            if (myVideo.paused){        //判断当前是否处于暂停状态
////                // 得到视频的总时长
////                var duration = myVideo.duration;
////                //得到当前的进度
////                var currentTime = myVideo.currentTime;
////                //从总时长的一半的位置开始播放
////                myVideo.currentTime = duration / 2;
//                myVideo.play();        //调用play()方法开发播放
//            }
//            else {
//                myVideo.pause();        //调用pause()方法暂停视频播放
//            }
//        }
        //从中间开始播放
//        function playInMid(){
//            //获取视频DOM元素
//            var myVideo = document.getElementById("my-video");
//            //得到视频的总时长
//            var duration = myVideo.duration;
//            //得到当前的进度
//            var currentTime = myVideo.currentTime;
//            //判断是否暂停中
//            if (!myVideo.paused)
//                myVideo.pause();
//            //从总时长的一半的位置开始播放
//            myVideo.currentTime = duration / 2;
//            //继续播放视频
//            myVideo.play();
//        }
        //全屏
        var docElm = document.documentElement;
        if(docElm.requestFullscreen){
            docElm.requestFullscreen();
        }
        else if (docElm.mozRequestFullScreen) {
            docElm.mozRequestFullScreen();
        }
        else if (docElm.webkitRequestFullScreen) {
            docElm.webkitRequestFullScreen();
        }
        else if (elem.msRequestFullscreen) {
            elem.msRequestFullscreen();
        }
        if (document.exitFullscreen) {
            document.exitFullscreen();
        }
        else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        }
        else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        }
        else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    </script>

</body>

</html>